<template>
  <div class="container">
    <div>
      置顶
      <el-input-number v-model="priceXcxTop" :min="0" :max="100" style="width:150px;" />
      元 / 天
    </div>
    <div style="margin: 10px 0;">
      刊登
      <el-input-number v-model="priceXcx" :min="0" :max="100" style="width:150px;" />
      元 / 天
    </div>
    <el-button type="primary" :loading="btnLoading" @click="savePrice()">保存</el-button>
  </div>
</template>

<script>
export default {
  name: 'PriceIndex',
  data() {
    return {
      loadingText: '加载中...',
      priceXcx: 0,
      priceXcxTop: 0,
      btnLoading: false
    }
  },
  mounted() {
    this.priceXcx = parseInt(localStorage.getItem('priceXcx'))
    this.priceXcxTop = parseInt(localStorage.getItem('priceXcxTop'))
  },
  methods: {
    savePrice() {
      this.savePriceXcx()
    },
    savePriceXcx() {
      this.btnLoading = true
      const para = {
        key: 'priceXcx',
        val: this.priceXcx
      }
      this.$http
        .post('/api/busConfig/save', para)
        .then(response => {
          if (response.data.success === true) {
            localStorage.setItem('priceXcx', this.priceXcx)
            this.savePriceXcxTop()
          } else {
            console.log('获取失败:' + response.data.message)
            this.$message({
              message: '获取失败:' + response.data.message,
              type: 'error'
            })
            this.btnLoading = false
          }
        })
        .catch(error => {
          console.log(error)
          this.btnLoading = false
        })
    },
    savePriceXcxTop() {
      const para = {
        key: 'priceXcxTop',
        val: this.priceXcxTop
      }
      this.$http
        .post('/api/busConfig/save', para)
        .then(response => {
          this.btnLoading = false
          if (response.data.success === true) {
            localStorage.setItem('priceXcxTop', this.priceXcxTop)
            this.$message({
              message: '操作成功',
              type: 'success'
            })
          } else {
            console.log('获取失败:' + response.data.message)
            this.$message({
              message: '获取失败:' + response.data.message,
              type: 'error'
            })
          }
        })
        .catch(error => {
          console.log(error)
          this.btnLoading = false
        })
    }
  }
}
</script>

<style scoped>
.container{
  padding: 20px;
}
</style>
